<template>
  <div class="box">
    <div class="sbox" v-for="(v,i) in arr" :key="i">
      <p><img :src="v.urlimg" alt="" /></p>
      <p>{{v.title}}</p>
      <p class="jifen">{{v.save}}</p>
      <p><button>兑换</button></p>
    </div>
  </div>
</template>

<script>
import axios from "@/apis/api.js"
export default {
  data(){
    return{
      arr:[]
    }
  },
  created(){
    axios("/data/list/putong").then((ok)=>{
      console.log(ok.data.data);
      this.arr=ok.data.data
    })
  }
};
</script>

<style scoped>
.box{
    margin: .08rem 0 0 .08rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.box p img {
  width: 1.75rem;
}
.sbox {
  height: 2rem;
  /* background: red; */
  width: 1.8rem;
  margin-top: .2rem;
}
.jifen {
  font-size: 0.12rem;
  color: rgb(246, 86, 72);
  padding-top: 0.1rem;
}
button {
  width: 0.8rem;
  height: 0.3rem;
  border: 1px solid rgb(246, 86, 72);
  color: rgb(246, 86, 72);
  border-radius: 0.2rem;
  float: right;
}
</style>